// src/pages/Home.tsx
import React, { useState, useEffect } from 'react';
import { Row, Col, Button } from 'antd';
import { DownloadOutlined } from '@ant-design/icons';
// import { Link } from 'react-router-dom';
import PicCarousel from '@/components/antd-study/PicCarousel/PicCarousel';
import './Home.css'
import Navbar from '@/components/navigation/Navbar';
import MainSection from './MainSection'
import FooterSection from './FooterSection';
import BottomDescription from './BottomDescription';

import AttractionMap from './tourism/AttractionMap';
import RouteRecommendation from './tourism/RouteRecommendation';
import CompoTimeline from '@/components/Timeline/CompoTimeline';
import ProductCarousel from '@/components/Carousel/ProductCarousel';
import Footer from '@/components/Footer/Footer';
import FastGPTIframe from './chatbot/fastgpt_iframe';



// import Button  from '@/components/common/button/rotten-emu-77-button';

const timelineData = [
  {
    id: '1',
    title: '国家乡村振兴局正式印发《“百校联百县兴干村行动”实施方案》',
    time: '2022-09-01',
    description: '<p>方案指出，要以习近平新时代中国特色社会主义思想为指导,坚持属地为主、校地共建、重心下沉、突出特色、稳妥推进五项工作原则，争取到 2025 年，“百校联百村”行动取得积极成效。</p>',
  },
  {
    id: '2',
    title: '国家乡村振兴局、清华大学在山东省威海市文登区联合举办“百校联百县兴干村”行动启动仪式',
    time: '2022-09-07',
    description: '<p>此次活动得到中国政府网、人民日报、新华社、中国新闻网、经济日报、中国青年报等新闻媒体报道，中央电视台农业农村频道《中国三农报道》也进行了宣传报道</p>',
    // imageUrl: '/placeholder.svg?height=200&width=300',
  },
  {
    id: '3',
    title: '深化部校合作',
    time: '2021-12',
    description: '<p>乡村建设高校联盟成立大会。刘焕鑫局长、时任清华大学党委书记陈旭等领导出席就深化部校合作会谈沟通。</p>',
  },
  {
    id: '4',
    title: '乡村建设研究院建立',
    time: '2022-01',
    description: '<p>与学校领导汇报沟通，申请设立乡村建设研究院</p><p>2022 年 3 月，国家乡村振兴局夏更生副局长与过勇副书记就共建乡村建设研究院等事宜进行磋商</p>',
  },
  {
    id: '5',
    title: '乡村建设研究院建立',
    time: '2023-01',
    description: '<p>校办党支部与学生乡村振兴协会联学共建活动，邱勇书记表态支持，指示加快推进乡村建设研究院建设</p>',
  },
]


const Home = () => {
  const [isFastGPTVisible, setIsFastGPTVisible] = useState(false);


  // useEffect(() => {
  //   const handleClick = () => {
  //     if (isFastGPTVisible) {
  //       setIsFastGPTVisible(false);
  //     }
  //   };

  //   document.addEventListener('click', handleClick);
  //   return () => {
  //     document.removeEventListener('click', handleClick);
  //   };
  // }, []);

  return (
    <>
      <FastGPTIframe isVisible={isFastGPTVisible} handleClose={() => setIsFastGPTVisible(false)} />


      <Navbar />
      <MainSection />
      <FooterSection />
      <BottomDescription />
      <div style={{ display: 'flex', padding: '40px 50px', gap: '20px', maxHeight: '60vh'}}>
        <div style={{ flex:1, overflowY: 'scroll'}}>
          <RouteRecommendation />
        </div>
        <div style={{flex:1}}>
          <AttractionMap />
        </div>
      </div>
      <div className="footer-section">
        <h2>南涧 AI 问答小助手</h2>
        <Button type="primary" shape="round" icon={<DownloadOutlined />} size={'middle'} onClick={() => setIsFastGPTVisible(true)}>


            GO
        </Button>
      </div>
      
      <div className="bottom-description">
        <CompoTimeline timelineData={timelineData} />
      </div>

      <ProductCarousel />
      
      <Footer />
    </>
  );
};

export default Home;

// const a = (
//   <>
//   <div style={{ height: '80vh', display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
//         <div style={{ textAlign: 'center'}}>
//           <PicCarousel
//             slides={[
//               {
//                 image: "https://cloud.tsinghua.edu.cn/thumbnail/0af0300efc8f4cea9b00/1024/%E7%85%A7%E7%89%87/7%E6%9C%882%E6%97%A5/7.2%20wsy/IMG_9423.JPG",
//                 title: "图片1",
//                 subtitle: "这是第一张图片的描述",
//               },
//               {
//                 image: "https://cloud.tsinghua.edu.cn/thumbnail/0af0300efc8f4cea9b00/1024/%E7%85%A7%E7%89%87/7%E6%9C%882%E6%97%A5/7.2%20wsy/IMG_9423.JPG",
//                 title: "图片2",
//                 subtitle: "这是第二张图片的描述",
//               }
//             ]}
//           />
//           {/* <img 
//             src="https://cloud.tsinghua.edu.cn/thumbnail/0af0300efc8f4cea9b00/1024/%E7%85%A7%E7%89%87/7%E6%9C%882%E6%97%A5/7.2%20wsy/IMG_9423.JPG" 
//             alt="公司宣传图" 
//             style={{ width: '100%', borderRadius: 8 }} 
//           />
//           <h1 style={{ marginTop: 24, fontSize: 36 }}>欢迎访问我们的官网</h1>
//           <p style={{ color: '#666', fontSize: 18 }}>这里是公司简介和核心业务描述</p> */}
//         </div>
//       </div>

//       <div style={{ padding: '64px 0', backgroundColor: '#f5f5f5', height: '20vh' }}>
//         <Row justify="center">
//           <Col xs={24} sm={12} md={8}>
//             {/* <Link to="/tourism"> */}
//               <Button 
//                 type="primary" 
//                 style={{ width: '100%', marginBottom: 16, height: 120, fontSize: 18 }}
//               >
//                 旅游
//               </Button>
//             {/* </Link> */}
//           </Col>
//           <Col xs={24} sm={12} md={8}>
//             {/* <Link to="/news"> */}
//               <Button 
//                 type="primary" 
//                 style={{ width: '100%', marginBottom: 16, height: 120, fontSize: 18 }}
//               >
//                 新闻
//               </Button>
//             {/* </Link> */}
//           </Col>
//           <Col xs={24} sm={12} md={8}>
//             {/* <Link to="/cultural-ecommerce"> */}
//               <Button 
//                 type="primary" 
//                 style={{ width: '100%', height: 120, fontSize: 18 }}
//               >
//                 文创电商
//               </Button>
//             {/* </Link> */}
//           </Col>
//         </Row>
//       </div>
//   </>
// )